<template>
  <div class="footer-container">
    <div class="gcs-footer">
      <!-- 社区导航链接 -->
      <div class="footer-top">
        <a href="#">首页</a>
        <a href="#">社区动态</a>
        <a href="#">社区活动</a>
        <a href="#">联系我们</a>
      </div>
      <!-- 其他信息 -->
      <div class="x">
        <p>当前时间: {{ nowtime.toLocaleString() }}</p>
        <p>版权所有 &copy; 2025 社区项目团队. 保留所有权利.</p>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      nowtime: new Date(),
      timer: null
    };
  },
  mounted() {
    // 启动定时器，每秒更新一次时间
    this.timer = setInterval(() => {
      this.nowtime = new Date();
    }, 1000);
  },
  methods: {},
  // 销毁定时器
  beforeDestroy() {
    if (this.timer) {
      clearInterval(this.timer);
    }
  },
};
</script>

<style scoped>
.footer-container {
  border-radius: 10px;
  background: rgba(116, 107, 107, 0.5);
  height: 100%;
}
.gcs-footer {
  padding: 5px;
  text-align: center;
  color: white;
}
.footer-top a {
  font-weight: bold;
  font-size: 10px;
  color: #f0f1f1;
  text-decoration: none;
  padding: 0 10px;
  vertical-align: middle;
}
.gcs-footer a:hover {
  color: rgb(3, 64, 114);
  font-weight: bold;
  text-decoration: blink;
}
.gcs-footer p {
  font-size: 10px;
  color: #5f5e5e;
}
.x a {
  font-weight: bold;
  color: #050505;
  text-decoration: none;
}
.x a:hover {
  font-weight: bold;
  color: #050505;
  text-decoration: none;
}
</style>
